<template>
	<div id="myshoucang">

		<div v-for="goods in tableData">
			<div v-for="user in goods.collectionList" style="width: 900px;height: 200px;border:2px solid #FFFFFF;">
				<div id="left">
					<img :src="user.collectionMedicinePicture" width="180px" height="180px" alt style="border: 1px solid #42B983;margin-left: 20px;border-radius: 10px;margin-top: 10px;" />
				</div>
				<div style="position: absolute;margin-top: -60px; margin-left: -80px;">
					<div style="position: absolute;margin-top: -100px; margin-left: 300px;">
						<el-tag color="white" style="color: orangered;font-size: 15px;border: 0px;">药品名称:</el-tag>
						<el-input v-model="user.collectionMedicineName" :disabled="true" style="width: 300px;height: 20px;position: absolute;margin-left: 10px;margin-top:0px;font-size: 15px;"
						placeholder="药品名称">
						</el-input>
					</div>



					<div style="position: absolute;margin-left: 300px;margin-top: -50px;">
						<el-tag color="white" style="color: orangered;font-size: 30px;border: 0px;width: 80px;text-align: center;">¥</el-tag>
						<el-input v-model="user.collectionMedicinePrice" :disabled="true" style="width: 100px;height: 20px;position: absolute;margin-top: -5px;margin-left: 15px;font-size: 15px;"
						placeholder="药品价格"></el-input>
						<el-input-number v-model="num" @change="handleChange" :min="1" :max="100" label="描述文字" style="position:absolute;margin-left: -100px;margin-top: 50px;transform: scale(0.8);"></el-input-number>
					</div>

					<div>

						<el-button type="success" v-model="buy" style="position: absolute;margin-left: 600px;margin-top: 0px;transform: scale(0.8);">查看详情</el-button>
						<el-button type="success" v-model="buy" style="position: absolute;margin-left: 500px;margin-top: 0px;transform: scale(0.8);">购买</el-button>
					</div>



				</div>
			</div>

		</div>

	</div>

</template>
<script>
	export default {
		props: ['myshoucang', 'username'],
		data() {
			return {
				tableData: [{
					"collectionList": [{
						collectionMedicinePicture: '',
						collectionMedicineName: "",
						collectionMedicinePrice: ""
					}]



				}],
				num: 1,

			}
		},
		mounted() {
			var that = this
			console.log(this.username)
			this.$axios.post("http://localhost:8088/xiaoxiang/findAllUserCollection", {
					userName: this.username
				})
				.then(function(response) {
					// console.log(response)
					that.tableData = response.data.data
					// eslint-disable-next-line no-unused-vars
				}).catch(function(error) {})
		},
		beforeRouteEnter: (to, from, next) => {
			next();
		}
	}
</script>

<style>

</style>
